<template>
	<view  v-if="userInfo" :lz-theme="APPTheme">
		<view class="index">
			<uni-nav-bar fixed status-bar :shadow='false' >
			    <view slot="left" @click="showdrawer">
					<u-avatar v-if="JSON.parse(userInfo).photo" :src="GLOBAL.image_svr+JSON.parse(userInfo).photo" mode="circle" size="60" style="margin-top: 20rpx;"></u-avatar>
					<view class="text-warp" v-else >{{computedUserInfo(1)}}</view>
				</view>
			    <view slot="right">
					<view style="margin-top: 12rpx;">
						<uni-icons type="plusempty" size="26"></uni-icons>
					</view>
				</view>
			</uni-nav-bar>
			<view class="content">
				<u-swiper :list="swiper.list" effect3d height="300"></u-swiper>
				<u-grid :col="4" class="grid">
					<u-grid-item >
						<u-icon name="edit-pen-fill" :size="46" color="#00aaff" ></u-icon>
						<view class="grid-text">待办</view>
					</u-grid-item>
					<u-grid-item>
						<u-icon name="file-text" :size="46" color="#ffaa00"></u-icon>
						<view class="grid-text">已办</view>
					</u-grid-item>
				</u-grid>
			</view>
			<lz-drawer ref="lzdrawer"></lz-drawer>
		</view>
	</view>
</template>

<script>
	let that,time
	import {
		mapGetters,
		mapActions
	} from 'vuex' 
	import lzDrawer from "./components/lz-drawer/lz-drawer.vue"
	export default {
		components:{
			lzDrawer
		},
		computed: {
			...mapGetters(['APPTheme','userInfo','api']),
			computedUserInfo(){
				return (type)=>{
					let user=''
					if(this.userInfo&&type==1){
						let name=JSON.parse(this.userInfo).name
						user=name.slice(name.length-2,name.length);
					}else if(this.userInfo&&type==0){
						user=JSON.parse(this.userInfo).name
					}
					return user
				}
			}
		},
		data() {
			return {
				swiper:{
					list:[{
						image: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
						title: '昨夜星辰昨夜风，画楼西畔桂堂东'
					},
					{
						image: 'https://cdn.uviewui.com/uview/swiper/2.jpg',
						title: '身无彩凤双飞翼，心有灵犀一点通'
					},
					{
						image: 'https://cdn.uviewui.com/uview/swiper/3.jpg',
						title: '谁念西风独自凉，萧萧黄叶闭疏窗，沉思往事立残阳'
					}]
				},
				ulist:[{
					title:'我的名片',
					extraIcon:{
						color: '#4cd964',
						size: '24',
						type: 'contact'
					}
				},
				{
					title:'服务大厅',
					extraIcon:{
						color: '#ff9f00',
						size: '22',
						type: 'home-filled'
					}
				},
				{
					title:'收藏',
					extraIcon:{
						color: '#0088fe',
						size: '22',
						type: 'shop'
					}
				},
				{
					title:'邀请',
					extraIcon:{
						color: '#d36e50',
						size: '22',
						type: 'paperplane-filled'
					}
				},
				{
					title:'我的健康码',
					extraIcon:{
						color: '#00b752',
						size: '22',
						type: 'heart'
					}
				},
				{
					title:'设置',
					extraIcon:{
						color: '#51749a',
						size: '22',
						type: 'gear-filled'
					}
				}]
			}
		},
		onLoad() {
			that = this
			//检测用户信息
			that.detectUserInfo()
			//标记tabbar角标
			that.setTabbarCorner()
		},
		onShow() {
			//设置主题颜色
			uni.$lizhao.setThemeColor(that.APPTheme)
			
		},
		onTabItemTap(e) {
			//设置主题颜色
			uni.$lizhao.setThemeColor(that.APPTheme)
		},
		methods: {
			...mapActions(['set_APPTheme']),
			//标记tabbar角标
			setTabbarCorner(){
				if(uni.getStorageSync('tabbarAllCount')&&uni.getStorageSync('tabbarAllCount')!=0){
					uni.setTabBarBadge({
					  index: 3,
					  text: ''+uni.getStorageSync('tabbarAllCount')
					})
				}else{
					uni.removeTabBarBadge({index: 3})
				}
			},
			//点击头像
			clickHeader(){
				uni.navigateTo({url: '/pages/index/myInfo/myInfo'});
			},
			//打开数据库
			openDatabase(){
				//判断数据库是否打开
				let onoff=that.$lizhao.lzsqlite.isOpenDatabase()
				if(!onoff){//打开数据库
					that.$lizhao.lzsqlite.openDatabase().then(res=>{
						//查询表是否存在，不存在就新建
						that.IsAddTableFn()
					})
				}else{
					// that.$lizhao.lzsqlite.closeDatabase()
					//查询表是否存在，不存在就新建
					that.IsAddTableFn()
				}
			},
			//查询表是否存在，不存在就新建
			IsAddTableFn(){
				//数据库message表是否存在
				that.$lizhao.lzsqlite.selectSql("select count(*)  from sqlite_master where type='table' and name = 'message'").then(res=>{
					if(res[0]['count(*)']==0){//不存在就创建
						console.log('message表不存在 正在创建');
						/*
						创建message表
						isSend是否发送 0正在发送，1已发送， 2发送失败
						isRead是否已读，0未读，1已读
						isTop是否置顶 0不置顶 1置顶
						isMsgShow当前消息在消息列表中是否删除【不显示】默认为显示1  0不显示
						userInfo发送者用户信息
						receiveInfo接收者用户信息
						secretKey:量子解密需要的secretKey
						*/
						that.$lizhao.lzsqlite.executeSql(`CREATE TABLE "message" (
							"id"	INTEGER NOT NULL UNIQUE,
							"type"	TEXT NOT NULL,
							"userId"	TEXT NOT NULL,
							"messageType"	TEXT NOT NULL,
							"content"	TEXT,
							"time"	TEXT NOT NULL,
							"isSend"	INTEGER NOT NULL,
							"receiveId"	TEXT,
							"uuid"	TEXT,
							"isRead"	INTEGER,
							"isTop"	INTEGER,
							"isMsgShow" INTEGER,
							"userInfo"	TEXT,
							"receiveInfo"	TEXT,
							"secretKey" TEXT,
							PRIMARY KEY("id" AUTOINCREMENT)
						)`)
						
					}else{
						console.log('message表已存在 正在删除');
						// that.$lizhao.lzsqlite.executeSql(`DROP TABLE message`)
					}
				})
			},
			//打开socket连接
			openWebSocket(){
				that.$lizhao.lzwebSocket.lz_websoket(true)
			},
			//检测用户信息
			detectUserInfo(){
				console.log('that.userInfo',that.userInfo);
				if(!that.userInfo){
					uni.reLaunch({
						url: '../template/login/login',
						success: res => {},
						fail: () => {},
						complete: () => {}
					});
					return
				}
				//#ifndef H5
				//打开数据库
				that.openDatabase()
				//#endif
				//打开socket连接
				that.openWebSocket()
			},
			
			//显示抽屉
			showdrawer(){
				this.$refs.lzdrawer.open()
			},
			
		}

	}
</script>

<style scoped lang="scss">
	.index{
		height: 100vh;
		@include background_color("background_color2");
		.text-warp{
			background: $bg-color;border-radius: 50%;width: 30px;height: 30px;font-size: 12px;display: flex;justify-content: center;align-items: center;color: #fff;
		}
		.grid{
			.grid-text {
				font-size: 28rpx;
				margin-top: 4rpx;
				color: #888;
			}
		}
	}
	
</style>
